<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    
    <title>10超链接的其他用法</title>
</head>
<body>
    <!-- 
        target属性：用来指定超链接打开的位置
            可选值：
                _self 默认值 在当前页面打开超链接(不标明的话默认是这个)
                _blank 在一个新的页面中打开超链接
     -->
     <a href="https://www.baidu.com" target="_blank">chaolianjie</a>
     <br>
     <a href="#bottom">去底部</a>
     <a href="#p3">跳转指定位置</a>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p id="p3">LLLLLLLLLLLLLLorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sint quos quibusdam, minus molestias voluptate impedit eveniet exercitationem. Accusamus atque deleniti incidunt eius. Delectus, ipsam. Autem enim corporis nihil ab totam!</p>
     
     <!-- 
        可以直接将超链接的href属性设置为#，这样点击超链接以后，页面不跳转，而是转到当前
            页面的顶部位置
        
        id属性：唯一不重复的，每一个标签都可以添加唯一标识，
                同一个页面中不能出现重复id属性

        #还可以作为占位符，或者用 javascript:;  更好
      -->

     <a id="bottom" href="#">回到顶部</a>
    </body>
    </html>